﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>主页</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
	 <meta http-equiv="X-UA-Compatible" content="IE=edge">
	 <link rel="stylesheet" type="text/css" href="../bootstrap3/css/bootstrap.css">
	 <link rel="stylesheet" type="text/css" href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />
	 <!-- 自定义样式 -->
	 <link rel="stylesheet" type="text/css" href="../css/index.css" />
</head>
<body>
		<!--登录页标题-->
		<header>
			<div class="container">
				<div class="row">
					<div class="col-md-10">
						<h1 style="color: #576f80;">
							<small>欢迎使用</small> <b>智能停车场管理系统</b>
						</h1>
					</div>
					<div id="row-2" class="col-md-1">
						<div class="glyphicon glyphicon-user">
						</div>
						<div>
							<a href="upload.html"></a>
						</div>
					</div>
					<div id="row-3" class="col-md-1">
						<div class="dropdown">
							<button type="button"
								id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true"
								aria-expanded="true">
								登录 <span class="caret"></span>
							</button>
							<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
								<li><a href="admindata.html">个人资料</a></li>
								<li><a href="password.html">修改密码</a></li>
								<li><button id="btn-logout" type="button" class="btn  btn-block">退出</button></li>
							</ul>
						</div>
					</div>
					<!-- row-3 结束 -->
				</div>
			</div>
		</header>
	 <div id="d1">
	 		<span>首页</span>
	 </div>
	 <div class="container" id="d2">
			<div class="row" id="row">
				<!--左侧菜单栏-->
				<div class="col-md-2" id="row1">
					<ul class="menu-list">
						<li class="sub">
							<a href="role/roleList.html"><span>停车场管理</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href=""><span>管理员系统</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href="click.html"><span>订单管理</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href="admin/adminList.html"><span>用户管理</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href="role/roleList.html"><span>角色管理</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href="password.html"><span>修改密码</span><i class="verflag"></i></a>
						</li>
						<li class="sub">
							<a href="admindata.html"><span>个人资料</span><i class="verflag"></i></a>
						</li>
					</ul>				
				</div>
			<!-- 右侧内容栏 -->
			<div class="col-md-10" id="row2" onmouseover="stop()" onmouseout="run()">
				<!-- 图片自动播放 -->
				<div class="tempWrap" style="overflow: hidden; position: relative; width: 975px" >
					<ul id="imglb">
						<li style="float: left; width: 975px;"><a href=""
							target="_blank"> <img src="../images/index/indexbg.jpeg"
								alt="">
						</a></li>
						<li style="float: left; width: 975px;"><a href=""
							target="_blank"> <img src="../images/index/indexbg2.jpeg"
								alt="">
						</a></li>
						<li style="float: left; width: 975px;"><a href=""
							target="_blank"> <img src="../images/index/indexbg3.jpeg"
								alt="">
						</a></li>
						<li style="float: left; width: 975px;"><a href=""
							target="_blank"> <img src="../images/index/indexbg6.jpeg"
								alt="">
						</a></li>
						<li style="float: left; width: 975px;"><a href=""
							target="_blank"> <img src="../images/index/indexbg5.jpeg"
								alt="">
						</a></li>
					</ul>
				</div>
				<div id="buttons"> 
					<span index="1" class="on"></span>
					<span index="2"></span>
					<span index="3"></span>
					<span index="4"></span>
					<span index="5"></span>
				</div>
				<a href="#" id="prev" class="arrow">&lt;</a>
				<a href="#" id="next" class="arrow">&gt;</a>
			</div>
		</div>
	</div>

	<!--网页页脚-->
		<footer>
			<div class="container" id="d3">
				<div class="row">
					<div class="col-md-12"  style="text-align:center">
						<br>
						<span>远程控制 | 在线预约 | 在线支付 | 合理规划</span>
					</div>
					<div class="col-md-12"  style="text-align:center">
						<!-- <h1>中国智能停车场云平台开创者</h1> -->
						<span>中国智能停车场管理平台专注给用户带来更好的停车体验,致力于解决停车过程中遇到的各种问题.</span>
						<span>Abc © 2019天花板 Design By 陈彦同 滇ICP备 6666666666号</span><br><br>
					</div>
				</div>
			</div>
		</footer>
</body>
	<script type="text/javascript" src="../bootstrap3/jquery.min.js"></script>
	<script type="text/javascript" src="../bootstrap3/js/bootstrap.js"></script>
	<script type="text/javascript" src="../bootstrap3/js/holder.js"></script>
	<script type="text/javascript" src="../bootstrap3/js/html5shiv.min.js"></script>
	<script type="text/javascript" src="../bootstrap3/js/css3-mediaqueries.js"></script>
	<script type="text/javascript" src="../bootstrap3/js/respond.min.js"></script>
	
	<script type="text/javascript" src="../js/jquery-1.4.2.js"></script>
	<script type="text/javascript">
	var left = 0;
	var index=1;
	var s=1;
	function play(){
		function animate(left){
			$("#imglb").animate({"left": left+"px"},1500);
			
			var buttons=document.getElementById('buttons').getElementsByTagName('span');
			for(var i=0;i<buttons.length;i++){
					buttons[i].className='';
			}
			//数组从0开始，故index需要-1
			buttons[index-1].className='on'; //设置下一个span的class属性值为'on'，即是高亮显示
		}
		var timer=setInterval(function(){
			if(s==0){
				clearInterval(timer);
				index--;
				left+=975;
			}
			index++;
			left-=975;
			if(left<=-975*5)left=0;
			if(index==6)index=1;
			animate(left);
		}, 3000);
	}
	play();
	
	function stop(){
		s=0;
	}
	
	function run(){
		s=1;
		play();
	}
	
	$("#prev").click(function(){ //向左的单击事件
		left+=975;
		index--;
		if(left>0)left=-975*4;
		if(index==0)index=5;
		animate(left);
	});

	$("#next").click(function(){ //向右的单击事件
		left-=975;
		index++;
		if(left<-975*5)left=0;
		if(index==6)index=1;
		animate(left);
	});

	$("#buttons>span").click(function(){
		var clickIndex=parseInt(this.getAttribute('index'));
		index=clickIndex;
		left=-(index-1)*975;
		animate(left);
	});
	
	</script>
<script type="text/javascript">
	$("#btn-logout").click(function() {
		$.ajax({
			"url" : "/shiro/logout",
			"type" : "get",
			"dataType" : "json",
			"success" : function(json){
				if (json.state === 2000) {
					alert("退出成功");
					location.href = "login.html";
				}else {
					alert("退出失败！" + json.message);
				}
			}
		});
	});
</script>
</html>